<template>
    <div class="commitFinish">

        <van-nav-bar title="收银台" left-text="返回" left-arrow safe-area-inset-top @click-left="$router.back" />
        <div class="main">
            <van-icon name="checked" size="100" color="green" />
            <p>订单支付成功</p>
            <p>支付金额￥{{ rushItem ? rushItem.price : store.totalMoney }}</p>
        </div>
        <div>
            <van-row class="row">
                <van-col offset="2" span="20">
                    <van-button round type="success" style="width: 100%;" @click="$router.push('/order')">确认订单</van-button>
                </van-col>
                <van-col offset="2" span="20">
                    <van-button round plain type="success" hairline style="width: 100%;" @click="$router.push('/')">回到首页
                    </van-button>
                </van-col>
            </van-row>
        </div>
    </div>
</template>

<script setup>
import { ref, onMounted, onUnmounted } from 'vue';
import useCartStore from '../../store/cart';
import useMenuStore from '../../store/menu';
const store = useCartStore()
const rushStore = useMenuStore()
const rushItem = rushStore.commitList[0]
onUnmounted(() => {
    // console.log(store.cart.filter(item=>item.check))
    if (!rushItem) {
        console.log('check')
        store.cart = store.cart.filter(item => {
            if (item.check) {
                store.totalAmount -= 1
            }
            return item.check == false
        })
    }
    // console.log(store.totalMoney)
    // console.log(rushStore.commitList[0])
    rushStore.removeGoods()
    rushStore.check = false
})

</script>

<style lang="less"  scoped>
.main {
    width: 100%;
    height: 220px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    background-color: rgb(234, 246, 234);

    span {
        color: white;
        font-size: 30px;
    }
}

.row {
    padding: 20px 0;

    .van-col {
        margin-top: 20px;
    }
}
</style>
